// miniprogram/pages/share/share.js
const moment = require('../../util/moment.js')
const {request, getData} = require('../../util/request')
const app = getApp()
Page({

    /**
     * 页面的初始数据
     */
    data: {
        title: '',
        slogan: '',
        num: '',
        course_id: null,
        imgSrc: '',
        showImg: false,
        ctx: '',
        month: '',
        date: '',
        day: '',
        weekCn: '',
        weekEn: ''
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        getData(`/mike/course/share/${options.course_id}`,
            (res) => {
                if (res.error == 0) {
                    let num = ''
                    if (res.data.shared_list.length === 1) {
                        num = '一'
                    }else if(res.data.shared_list.length === 0) {
                        num = '两'
                    }
                    this.setData({
                        title: res.data.title,
                        slogan: res.data.slogan,
                        num: num
                    })
                }
            },
            (error) => {
            })
        this.setData({
            course_id: options.course_id
        })
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {
        this.setTime()
        this.downloadQrCode()
        // this.getQrcode()
    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {
        return {
            title: '每天半小时，轻松拿本科',
            path: `/pages/index/index?course_id=${this.data.course_id}&inviter_id=${app.globalData.userId}`,//实验发现，此处的路径应该写全，写到具体的wxml页面。如path:'/page/user/user?id=123'
            success: function(res) {
                // 转发成功
                wx.showToast({
                    title: '分享成功'
                })
            },
            fail: function(res) {
                // 转发失败
                wx.showToast({
                    icon: 'none',
                    title: '分享失败'
                })
            }
        }
    },
    saveImg() {
        wx.getImageInfo({
            src: this.data.imgSrc,
            success: function (res) {
                var path = res.path;
                wx.saveImageToPhotosAlbum({
                    filePath: path,
                    success: function (res) {
                        // console.log('图片已保存');
                        wx.showToast({
                            title: '图片已保存',
                            icon: 'success',
                            duration: 2000
                        })
                        this.setData({
                            hiddenLayer: true
                        })
                    },
                    fail: function (res) {
                        // console.log('保存失败');
                        wx.showToast({
                            title: '保存失败，请重试',
                            icon: 'none',
                            duration: 2000
                        })
                    }
                })
            }
        });
    },
    showCard() {
        this.setData({
            showImg: true
        })
    },
    setTime() {
        let monthStr = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
        let indexCn = ['日', '一', '二', '三', '四', '五', '六']
        let indexEn = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday ', 'Saturday']
        let day = moment().date()
        let date = moment().format('YYYY/MM')
        let month = monthStr[moment().month()]
        let week = moment().weekday()
        this.setData({
            day: day,
            date: date,
            month: month,
            weekCn: indexCn[week],
            weekEn: indexEn[week]
        })

    },
    getQrcode() {
        // 获取access_token
        let that = this
        wx.request({
            url: "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wxe0a3f614bf147015&secret=8d0ea0a83fc074dd09822e554c804cd5",
            success: function (res) {
                let token = res.data.access_token
                wx.request({
                    url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=' + token, //仅为示例，并非真实的接口地址
                    data: {
                        path: "pages/index/index?id=565",
                        scene: '444'
                    },
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        'content-type': 'application/json' // 默认值
                    },
                    success(res) {
                        let qrCodeUrl = res.data
                        request('/mike/live/upload', {content: qrCodeUrl}, function (res) {

                        }, function (err) {

                        })
                        let base64 = 'data:image/jpg;base64,' + wx.arrayBufferToBase64(qrCodeUrl);
                        that.setData({
                            src: qrCodeUrl
                        })
                        setTimeout(() => {
                            const ctx = wx.createCanvasContext('shareCanvas')
                            ctx.moveTo(26, 25)
                            ctx.lineTo(80, 25)
                            ctx.moveTo(26, 120)
                            ctx.lineTo(80, 120)
                            ctx.setLineWidth(1)
                            ctx.setStrokeStyle("#665C4E")
                            ctx.stroke()
                            ctx.drawImage(base64, 100, 430, 120, 120)
                            ctx.draw()
                        }, 2000)

                        // that.drawImg(qrCodeUrl)
                    }
                })
            }
        })
    },
    downloadQrCode() {
        wx.showLoading({ title: '生成中...',mask: true,});
        let that = this
        wx.downloadFile({
            url: `https://api.wrox.cn/wechat/mini/mike/wx/mini_code?scene=${this.data.course_id}&${app.globalData.userId}`,
            success: function (res) {
                if (res.statusCode === 200) {
                    let qrCodeSrc = res.tempFilePath;
                    that.drawImg(qrCodeSrc)
                }else{
                    wx.showToast({
                        title: '二维码下载失败！',
                        icon:'none',
                        duration: 2000,
                        success:function(){
                            that.drawImg('')
                        }
                    })
                }
            }
        })
    },
    drawImg(qrCodeUrl) {
        let that = this
        const ctx = wx.createCanvasContext('shareCanvas')
        // draw line
        ctx.rect(-10, -10, 350, 538)
        ctx.setFillStyle('#ffffff')
        ctx.fill()
        ctx.moveTo(26, 25)
        ctx.lineTo(80, 25)
        ctx.moveTo(26, 120)
        ctx.lineTo(80, 120)
        ctx.setLineWidth(1)
        ctx.setStrokeStyle("#665C4E")
        ctx.stroke()

        // 画日期
        //ctx.strokeText(this.data.date,28,37)
        ctx.setFillStyle("#665C4E")
        ctx.setFontSize(12)
        ctx.fillText(this.data.date, 26, 42)
        ctx.fillText(this.data.month, 26, 112)
        ctx.setFontSize(36)
        ctx.fillText(this.data.day, 26, 88)
        // 右侧文字
        ctx.setTextAlign('right')
        ctx.setFontSize(10)
        ctx.fillText('布克大学，一站式的自考服务机构', 315, 42)
        ctx.setFontSize(18)
        ctx.font = 'normal bold 18px sans-seri'
        ctx.fillText('星期' + this.data.weekCn, 315, 72)
        ctx.setFontSize(12)
        ctx.font = 'normal bold 12px sans-seri'
        ctx.fillText(this.data.weekEn, 315, 92)

        // 画图片

        let x = 25
        let y = 135
        let w = 290
        let h = 130
        let r = 5
        ctx.save()
        ctx.beginPath()
        // 因为边缘描边存在锯齿，最好指定使用 transparent 填充
        // 这里是使用 fill 还是 stroke都可以，二选一即可
        ctx.setFillStyle('transparent')
        // ctx.setStrokeStyle('transparent')
        // 左上角
        ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5)

        // border-top
        ctx.moveTo(x + r, y)
        ctx.lineTo(x + w - r, y)
        ctx.lineTo(x + w, y + r)
        // 右上角
        ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2)

        // border-right
        ctx.lineTo(x + w, y + h - r)
        ctx.lineTo(x + w - r, y + h)
        // 右下角
        ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5)

        // border-bottom
        ctx.lineTo(x + r, y + h)
        ctx.lineTo(x, y + h - r)
        // 左下角
        ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI)

        // border-left
        ctx.lineTo(x, y + r)
        ctx.lineTo(x + r, y)

        // 这里是使用 fill 还是 stroke都可以，二选一即可，但是需要与上面对应
        ctx.fill()
        // ctx.stroke()
        ctx.closePath()
        // 剪切
        ctx.clip()
        ctx.rect(25, 135, 290, 130)
        ctx.setFillStyle("#F4ECE1")
        ctx.fill()
        // ctx.setFontSize(16)
        ctx.setFillStyle('#151515')
        ctx.setTextAlign('center')
        //ctx.fillText('三步让你学会PPT制作精髓',165,185)
        // 画两次加粗。。。
        ctx.font = 'normal bold 16px sans-seri'
        // this.canvasTextAutoLine('三步让你学会PPT制作精髓', ctx, 165, 184.5, 22, 220, 1)
        this.canvasTextAutoLine(this.data.title, ctx, 165, 185, 22, 220, 1)
        ctx.setFontSize(12)
        // ctx.fillText('15节课让你成为职场ppt达人15节课让你成为职场ppt达人15节课让你成为职场ppt达人15节课让你成为职场ppt达人',165,207)
        ctx.font = 'normal normal 12px sans-seri'
        let str = this.data.slogan;
        this.canvasTextAutoLine(str, ctx, 165, 215, 22, 220, 2)
        ctx.restore()

        ctx.setTextAlign('left')
        ctx.setFontSize(12.5)
        ctx.setFillStyle('#151515')
        // ctx.fillText('课不容缓，离成功更近一步',25,304.5)

        ctx.font = 'normal bold 12px sans-seri';
        ctx.fillText('课不容缓，离成功更近一步', 25, 305)

        ctx.setTextAlign('right')
        ctx.setFontSize(11)
        ctx.setFillStyle('rgba(21, 21, 21, 0.5)')
        ctx.fillText('——— 来自布克大学', 300, 338)
        ctx.setLineDash([2, 3]);
        ctx.lineWidth = 1;
        ctx.strokeStyle = '#DFDFDF';
        ctx.beginPath();
        ctx.moveTo(25, 375);
        ctx.lineTo(315, 375);
        ctx.stroke();

        // 小程序二维码
        ctx.setTextAlign('center')
        ctx.setFontSize(12)
        ctx.setFillStyle('#151515')
        ctx.fillText('长按识别小程序', 165, 400)
        ctx.setFontSize(10)
        ctx.setFillStyle('rgba(21, 21, 21, 0.5)')
        ctx.fillText('分享邀请到 2 位新好友，即可免费获得课程', 165, 495)

        ctx.drawImage(qrCodeUrl, 135, 410, 60, 60)
        ctx.draw(false, () => {
            wx.canvasToTempFilePath({
                x: 0,
                y: 0,
                width: 330,
                height: 508,
                destWidth: 660,
                destHeight: 1016,
                canvasId: 'shareCanvas',
                success(res) {
                    that.setData({imgSrc: res.tempFilePath})
                    wx.hideLoading();
                }
            })
        })
    },
    // 文字换行 超出指定行数省略。。。
    canvasTextAutoLine: function (str, ctx, initX, initY, lineHeight, maxWidth, row = 1) {
        var lineWidth = 0;
        var lastSubStrIndex = 0;
        var currentRow = 1;
        for (let i = 0; i < str.length; i++) {
            lineWidth += ctx.measureText(str[i]).width;
            if (lineWidth > maxWidth) {
                currentRow++;
                let newStr = str.substring(lastSubStrIndex, i)
                if (currentRow > row && str.length > i) {
                    newStr = str.substring(lastSubStrIndex, i - 2) + '...'
                }
                ctx.fillText(newStr, initX, initY);
                initY += lineHeight;
                lineWidth = 0;
                lastSubStrIndex = i;

                if (currentRow > row) {
                    break;
                }
            }
            if (i == str.length - 1) {
                ctx.fillText(str.substring(lastSubStrIndex, i + 1), initX, initY);
            }
        }
    },
})
